


@prefix: dumi-default;

@s-content-width: 1392px;
@s-content-padding: 48px;
@s-sidebar-width: 184px;
@s-header-height: 76px;
@s-header-height-m: 52px;

// default theme colors
@c-primary: hsl(261deg 80% 48%);

@c-warning: #d59200;
@c-success: #208a41;
@c-error: #ce1f31;
@c-text: #30363f;
@c-text-secondary: #4f5866;
@c-text-note: #8a9099;
@c-text-footer: lighten(@c-text, 40%);
@c-border: #d0d5d8;
@c-border-light: #e4e9ec;
@c-site-bg: #fff;
@c-site-defaule-bg: darken(@c-site-bg, 8%);
@c-white: #fff;
@c-btn-bg-primary: @c-primary;


.boxShaowFunColor(@x, @y, @z, @d, @a) {
  @result: rgba(0, 0, 0, @a) @x @y @z @d; 
}

.boxShaowFun() {
  @result: .boxShaowFunColor(0px,0px,0px,0px, 0)[@result], .boxShaowFunColor(0px,0px,0px,0px, 0)[@result], rgba(0, 0, 0, 0.03) 0px 1px 2px 0px, rgba(0, 0, 0, 0.047) 0px 3px 7px 0px, rgba(0, 0, 0, 0.08) 0px 12px 30px 0px;
}

.boxShaow() {
  box-shadow: .boxShaowFun()[@result];
  @{dark-selector} & {
    box-shadow: @c-normal-boxShaow-dark;
  };
}
@c-primary-boxShaow: .boxShaowFun()[@result];
@c-primary-boxShaow-button: @c-primary 0px 7px 29px 0px;
@c-normal-boxShaow: 0px 10px 50px darken(@c-site-bg, 20%);
@c-normal-boxShaow-deep: 0px 10px 50px darken(@c-site-bg, 60%);


// dark theme colors
// @dark-selector be injected by less-loader in feature/theme/index.ts
@dark-solid-amount: 15%;
@dark-light-amount: 22%;
@dark-border-amount: 71%;
@dark-text-amount: 70%;
@c-primary-dark: lighten(@c-primary, 20%);
@c-warning-dark: darken(@c-warning, @dark-solid-amount);
@c-success-dark: darken(@c-success, @dark-solid-amount);
@c-error-dark: darken(@c-error, @dark-solid-amount);
@c-text-dark: lighten(@c-text, @dark-text-amount);
@c-text-dark-all-white:lighten(@c-text, 100%);
@c-text-secondary-dark: lighten(@c-text-secondary, @dark-text-amount);
@c-text-note-dark: lighten(@c-text, @dark-light-amount);
@c-border-dark: darken(@c-border, @dark-border-amount);
@c-border-less-dark: darken(@c-border-light, @dark-border-amount);
@c-site-bg-dark: rgb(35, 39, 47);
@c-normal-boxShaow-dark: 0px 0px 8px 8px lighten(@c-site-bg-dark, 5%) ;
@c-text-footer-dark:lighten(@c-text, 70%);

@font-family: -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;

@mobile: ~'only screen and (max-width: 767px)';
@tablet: ~'only screen and (min-width: 768px) and (max-width: 1024px)';
@desktop: ~'only screen and (min-width: 1025px)';